@extends('layouts.layouts')
@section('title')
    <title>后台首页</title>
    <style>
        .file {
            position: relative;
            display: inline-block;
            background: #D0EEFF;
            border: 1px solid #99D3F5;
            border-radius: 4px;
            padding: 4px 12px;
            overflow: hidden;
            color: #1E88C7;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
        }
        .file input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
        }
        .file:hover {
            background: #AADFFD;
            border-color: #78C3F3;
            color: #004974;
            text-decoration: none;
        }
        .form-horizontal .form-group {
            margin-right: 5px;
            margin-left: -1px;
        }
    </style>
@endsection
@section('content')
    <style>

        .form-horizontal .form-group {
            margin-right: 5px;
            margin-left: -1px;
        }
    </style>
    <link rel="stylesheet" href="/lib/layer/theme/default/layer.css"/>
    <script type="text/javascript" src="/lib/layer/layer.js"></script>
    <link href="/css/ueditor.css" type="text/css" rel="stylesheet">
    <div class="content">
        <div class="header">
            <ul class="breadcrumb">
                <li><a href="/course/list">课程管理</a>／<a href="/courseMessage/push/{{$courseClass->id}}">课程推送</a> </li>

            </ul>
        </div>
        <div class="main-content">
            <ul class="nav nav-tabs nav-tabs-course">
                <li role="presentation" class="course_add active"><a href="javascript:void(0);">课程推送</a></li>
                <li role="presentation" class="course_define"><a href="javascript:void(0);">自定义模版推送</a></li>
                <li><a href="javascript:void(0);">推送记录</a> </li>
            </ul>
            <form class="form-horizontal" id="courseFormInfo" action="/course/postCreate" method="post" style="">
                {{csrf_field()}}
                <div class="course_class">
                    <div class="col-md-10">
                        <br>
                        <div class="tab-content">
                            <div class="form-group">
                                <label for="inputEmail3" class="col-sm-3 control-label">推送课程</label>
                                <div class="col-sm-9">
                                    <label class="form-control" id="inputEmail3">{{$courseClass->title}}</label>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="inputPassword3" class="col-sm-3 control-label">推送类型</label>
                                <div class="col-sm-9">
                                    <select class="form-control courseType" name="courseType" autocomplete="off" onchange="setRecommendPush(this)">
                                        @foreach($pushType as $key => $type)
                                        <option value="{{$key}}">{{$type}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="form-group push_recommend" style="display:none;">
                                <label for="inputPassword3" class="col-sm-3 control-label">推送用户(用户注册时间段)</label>
                                <div class="col-sm-9">
                                    <div class="form-inline">
                                        <div class="form-group">
                                            <input type="text" class="form-control" class="startTime" name="startTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" placeholder="用户注册开始时间" value="">
                                        </div>&nbsp;至&nbsp;
                                        <div class="form-group">
                                            <input type="text" class="form-control" class="endTime" name="endTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})"  placeholder="用户注册结束时间" value="">
                                    </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group course_buy" style="display:none;">
                                <label for="inputPassword3" class="col-sm-3 control-label">已购买课程</label>
                                <div class="col-sm-9">
                                    <button type="button" class="btn btn-primary btn-lg" data-page="1" onclick="selectCourse(this);">选择</button>&nbsp;&nbsp;<span style="color:blue;" id="courseId"></span>
                                    <input type="hidden" class="form-control" value="" id="inputPassword3" name="courseId">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <p>
                            <button type="button" class="btn btn-primary btn-lg col-md-offset-5" data-id="{{$courseClass->id}}" onclick="pushMessages(this);" style="width:120px;background:#286090;color:#fff;">一键推送</button>
                        </p>
                    </div>
                </div>
                <div class="course_class_define" style="display:none;">
                    <div class="col-md-10">
                        <br>
                        <div class="tab-content">
                            <div class="form-group">
                                <label for="inputEmail3" class="col-sm-3 control-label">推送课程</label>
                                <div class="col-sm-9">
                                    <label class="form-control" id="inputEmail3">{{$courseClass->title}}</label>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="inputPassword3" class="col-sm-3 control-label">推送标题</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" class="defineTitle" name="defineTitle" placeholder="模版消息标题" value="">
                                </div>
                            </div>
                            <div class="form-group push_recommend">
                                <label for="inputPassword3" class="col-sm-3 control-label">推送内容</label>
                                <div class="col-sm-9">
                                    <div class="form-inline">
                                        <div class="form-group">
                                            <textarea type="text/plain" class="form-control valid" placeholder="" id="pushDefineMsg" style="width:600px;height:100px;" placeholder="模版消息标题" name="pushMessage"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <p>
                            <button type="button" class="btn btn-primary btn-lg col-md-offset-5" data-id="{{$courseClass->id}}" onclick="pushDefineMessage(this)" style="width:120px;background:#286090;color:#fff;">一键推送</button>
                        </p>
                    </div>
                </div>
                <div  style="display:none;" class="row course_section">
                    <table class="table table-hover col-md-10">
                        <thead>
                        <tr>
                            <th>序号</th>
                            <th>推送类型</th>
                            <th>信息</th>
                            <th>推送时间</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($pushLogs as $log)
                        <tr>
                            <th scope="row">{{$log->id}}</th>
                            <td>{{$log->type}}</td>
                            <td>{{$log->description}}</td>
                            <td>{{$log->created_at}}</td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </form>
        </div>
    </div>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">选择课程</h4>
                </div>
                <div class="modal-body"></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>
    <script src="/js/course.js"></script>
    <script src="/lib/jquery.validate.js" type="text/javascript"></script>
    <script>
        function setRecommendPush(obj){
//            alert($(obj).val());
            var type = $(obj).val();
            if(type == 'RECOMMEND'){
                $('.push_recommend').css('display','block');
            }else{
                $('.push_recommend').css('display','none');
            }
            if(type == 'COURSEBUY'){
                $('.course_buy').css('display','block');
            }else{
                $('.course_buy').css('display','none');
            }
        }
        function pushMessages(obj){
            var id = $(obj).attr('data-id');
            var _token = '{{csrf_token()}}';
            var type = $('.courseType').val();
            var startTime = $("input[name='startTime']").val();
            var endTime = $("input[name='endTime']").val();
            var courseId = $("input[name='courseId']").val();

            if(type == 'RECOMMEND'){
                if(startTime == '' || endTime == ''){
                    layer.alert('日期未填写');
                    return false;
                }
                var data = {id:id ,_token:_token,type:type,startTime:startTime,endTime:endTime,courseId:courseId};
            }else{
                var data = {id:id ,_token:_token,type:type,courseId:courseId};
            }
            if(type == 'COURSEBUY'){
                if(courseId == ''){
                    layer.alert('未选择课程');
                    return false;
                }
            }
            var name = $('.courseType option:selected').text();
            var message = '确定推送'+name+'?';

            var object = obj;
                layer.confirm(message, {
                    btn: ['是', '否'],
                }, function(index){
                    $.ajax({
                        url:'/courseClass/push',
                        data:data,
                        type:'POST',
                        dataType:'json',
                        success:function(res){
                            layer.alert(res.message);
                            if(res.code == 0){
                                window.location.reload();
                            }
                        }
                    });
                    layer.close(index);
                    return true;
                }, function(index){
                    layer.close(index);
                });
        }
        function pushDefineMessage(obj){
            var id = $(obj).attr('data-id');
            var _token = '{{csrf_token()}}';
            var content = $('#pushDefineMsg').val();
            var title = $("input[name='defineTitle']").val();
            alert(title);
            if(title == ''){
                layer.alert('标题未设置');
                return false;
            }
            if(content == ''){
                layer.alert('内容为设置');
                return false;
            }
            var data = {id:id ,_token:_token,content:content,title:title};

            var message = '确定推送?';

            var object = obj;
            layer.confirm(message, {
                btn: ['是', '否'],
            }, function(index){
                $.ajax({
                    url:'/courseClass/define/push',
                    data:data,
                    type:'POST',
                    dataType:'json',
                    success:function(res){
                        layer.alert(res.message);
                        if(res.code == 0){
                            window.location.reload();
                        }
                    }
                });
                layer.close(index);
                return true;
            }, function(index){
                layer.close(index);
            });
        }
        $("#courseFormInfo").validate({
            onsubmit: true,// 是否在提交时验证
            submitHandler: function (form) {

                form.submit();
            }
        });
    </script>
    <style type="text/css">
        .col-sm-2{
            width:60px;
        }
        .course_content{
            margin-right: -30px;
            margin-left: -30px;
            margin-top:5px;
        }
        .btn-success{
            background-image:none!important;
        }
    </style>
@endsection